<template>
  <j-modal
    :title="'报表上报'"
    :width="800"
    :visible="visible"
    :maskClosable="false"
    :ok-button-props="{ props: { disabled: disableSubmit } }"
    :fullscreen="true"
    @close="close"
    cancelText="关闭"
  >
    <template slot="footer">
      <a-button key="back" style="padding-left: 8px; padding-right: 8px" @click="close(false)"> 关闭</a-button>
      <a-popconfirm :disabled="disableSubmit" title="确定保存吗?" @confirm="() => saveOrSubmit('save', null)">
        <a-button key="save" style="padding-left: 8px; padding-right: 8px" :disabled="disableSubmit"> 保存</a-button>
      </a-popconfirm>
      <a-button
        key="submit"
        type="primary"
        style="padding-left: 8px; padding-right: 8px"
        :disabled="disableSubmit"
        @click="close(true)"
      >
        提交审批
      </a-button>
    </template>
    <a-spin :spinning="Loading">
      <div :class="{ isCheck: isCheck }">
        <!-- <div class="table-header">
          <span class="table-title">填报单位：</span>{{ model.departName }} <span class="table-title">审计负责人：</span
          >{{ model.auditPersonName }} <span class="table-title">填表人：</span>{{ model.createByText }}
          <span class="table-title">填表时间：</span>{{ model.createTime }} <span class="table-title">统计时间：</span
          >{{ model.year }}年（{{ model.quarter }}季度）
        </div> -->
        <a-table
          rowKey="xu"
          class="edit-list"
          ref="table"
          size="middle"
          bordered
          width="100vw"
          :pagination="false"
          :columns="columns"
          :dataSource="dataSource"
          :rowClassName="tableRowClass"
          :scroll="{ x: 250, y: 520 }"
        >
          <!-- 表头 -->
          <div slot="title">
            <div class="title">{{ title }}</div>
            <div class="sub-title">
              <div>填报单位：{{ model.departName }}</div>
              <div>{{ model.year }}年（{{ model.quarter }}季）度</div>
              <div>审计负责人：
                <fzrSelect :disabled="disableSubmit" v-model="model.shenRespId"></fzrSelect>
              </div>
              <div>填表人：{{ model.createByText }}</div>
              <div>填表时间：{{ model.createTime }}</div>
              <div>金额单位（万元）</div>
            </div>
          </div>
          <template slot="customTitle">
            <div class="header-title">
              <div style="position: absolute; top: 62px; left: -51px">项目</div>
              <div style="position: absolute; top: 11px; left: 20px; width: 30px">内容</div>
              <div
                style="
                  content: '';
                  position: absolute;
                  width: 1px;
                  height: 188px;
                  top: -40px;
                  left: 0px;
                  background-color: rgb(200 207 211);
                  display: block;
                  transform: rotate(305deg);
                  box-sizing: border-box;
                "
              />
            </div>
          </template>
          <template slot="name" slot-scope="name">
            <div style="width: 100%; height: 45px; overflow-x: hidden; overflow-y: auto">{{ name }}</div>
          </template>
          <template v-for="col in customRenderList" v-slot:[col]="text, record, index">
            <div :key="col" v-if="record.name != '合计'">
              <a-input-number
                v-if="!disableSubmit"
                class="inputnumber"
                :precision="2"
                :key="col"
                :disabled="disableSubmit"
                @change="handleChange(record, col)"
                v-model="record[col]"
              />
              <span v-else>
                 {{record[col]}}
              </span>
            </div>
            <div :key="col" v-else>
              <span class="spancell">
                 <a-input-number
                   :disabled="true"
                   class="inputnumber"
                   style="background: #e4e7ed;color:black"
                   :precision="2"
                   v-model="record[col]"
                 />
              </span>
            </div>
          </template>
          <template v-for="item in spancell" v-slot:[item]="text">
            <span class="spancell" :key="item">
               <a-input-number
                 :disabled="true"
                 class="inputnumber"
                 style="background: #e4e7ed;color:black"
                 :precision="2"
                 v-model="text"
               />
            </span>
          </template>
        </a-table>
        <div class="uploadFile" style="height: 40px; line-height: 40px; position: relative; margin-top: 10px;width:97vw">
          <span style="font-size: 16px" v-if="disableSubmit">说明性文件:</span>
          <ZUpload
            style="position: absolute; left: 120px;width:92%"
            :disabled="disableSubmit"
            :isShow="disableSubmit"
            ref="fileUpload"
            :fileid="model.fileId"
            @uploadFile="saveData"
            :isScroll="true"
          ></ZUpload>
        </div>
      </div>
    </a-spin>

    <SelectApprove ref="approver" @submitData="saveOrSubmit"></SelectApprove>
  </j-modal>
</template>
<script>
  import columns from './columns2'
  import SelectApprove from '../SelectApprover'
  import fzrSelect from '../fzrSelect'
  import ZUpload from '../../../components/ZUpload'
  import {BbsbModelMixin1} from './BbsbModelMixin1'
  import {deleteAction} from '@/api/manage'

  export default {
    name: 'ModelView2',
    mixins: [BbsbModelMixin1],
    components: {
      SelectApprove,
      ZUpload,
      fzrSelect
    },
    data() {
      return {
        columns: columns(this),
        btnStyle: 'save',
        approveId: '',
        type: '2',
        model: {},
        url: {
          list: '/sjxxzhgl/sjProjectReport/queryProjectReportInfoById',
          getCreatData: '/sjxxzhgl/sjProjectReport/projectInitData',
          add: '/sjxxzhgl/sjProjectReport/add',
          edit: '/sjxxzhgl/sjProjectReport/edit',
          submitData: '/common/sjProcCommon/reportShen',
          delete: '/sjxxzhgl/sjProjectReport/remove',
        },
        customRenderList: [
          'a2',
          'a3',
          'a4',
          'a5',
          'a6',
          'a7',
          'a8',
          'a9',
          'a10',
          'a11',
          'a12',
          'a13',
          'a14',
          'a15',
          'a16',
          'a18',
          'a19',
          'a20',
          'a21',
        ],
        spancell: [
          'a1',
          'a17'
        ]
      }
    },
    created() {
    },
    methods: {
      handleChange(row, col) {
        this.currentRow = row
        if (
          col === 'a2' ||
          col === 'a3' ||
          col === 'a4' ||
          col === 'a5' ||
          col === 'a6' ||
          col === 'a7' ||
          col === 'a8' ||
          col === 'a9' ||
          col === 'a10' ||
          col === 'a11' ||
          col === 'a12' ||
          col === 'a13' ||
          col === 'a14' ||
          col === 'a15' ||
          col === 'a16'
        ) {
          row['a1'] =
            parseFloat(row['a2'] || '0') +
            parseFloat(row['a3'] || '0') +
            parseFloat(row['a4'] || '0') +
            parseFloat(row['a5'] || '0') +
            parseFloat(row['a6'] || '0') +
            parseFloat(row['a7'] || '0') +
            parseFloat(row['a8'] || '0') +
            parseFloat(row['a9'] || '0') +
            parseFloat(row['a10'] || '0') +
            parseFloat(row['a11'] || '0') +
            parseFloat(row['a12'] || '0') +
            parseFloat(row['a13'] || '0') +
            parseFloat(row['a14'] || '0') +
            parseFloat(row['a15'] || '0') +
            parseFloat(row['a16'] || '0')
          this.setHj(col, 'a1')
        } else if (col === 'a18' || col === 'a19' || col === 'a20' || col === 'a21') {
          row['a17'] =
            parseFloat(row['a18'] || '0') +
            parseFloat(row['a19'] || '0') +
            parseFloat(row['a20'] || '0') +
            parseFloat(row['a21'] || '0')
          this.setHj(col, 'a17')
        }
      },
      setHj(col, column) {
        let rows = this.dataSource.length - 1
        let num = 0
        let hjNum = 0
        for (let i = 1; i < rows; i++) {
          num = num + parseFloat(this.dataSource[i][col] || 0)
          hjNum = hjNum + parseFloat(this.dataSource[i][column] || 0)
        }
        this.dataSource[0][col] = num
        this.dataSource[0][column] = hjNum
      },
      // 保存或提交
      saveOrSubmit(style, approveId) {
        this.btnStyle = style
        this.approveId = approveId
        this.$refs.fileUpload.saveFile('sjfxwtfltjb')
      },
      delete(record) {
        deleteAction(this.url.delete, {id: record.id}).then((res) => {
          if (res.success) {
            this.$message.success(res.message)
            this.$emit('ok')
          } else {
            this.$message.error(res.message)
          }
        })
      },
    },
  }
</script>

<style lang="less" scoped>
  // @import '../../../css/checkAndEdit.less';
  @import '../../css/baobiaotable.less';

  .table-header {
    margin-bottom: 10px;

    .table-title {
      font-weight: bold;
      margin-left: 15px;
    }
  }
</style>
